
.a {
    text-decoration: none;
} 

#blog-summary {
    min-height: 200px;
    margin-top: 25px;
    padding: 2rem;
    font-weight: normal;
  }


a,
.green {
  text-decoration: none;
  color: hsla(160, 100%, 37%, 1);
  transition: 0.4s;
  padding: 3px;
}

@media (hover: hover) {
  a:hover {
    background-color: hsla(209, 77%, 72%, 0.2);
    box-shadow: 10px 10px 5px hsla(209, 77%, 72%, 0.5);
  }
}


.move-trans-toLeft {
  animation-duration: 1s;
  animation-name: slidein-toLeft;
}

@keyframes slidein-toLeft {
  from {
      margin-left: 100%;
      width: 200%;
      background-color:azure;
  }

  to {
      margin-left: 0%;
      width: 100%;
      background-color: white;
  }
}

.move-trans-toRight {
  animation-duration: 1s;
  animation-name: slidein-toRight;
}

@keyframes slidein-toRight {
  from {
      margin-left: -100%;
      width: 200%;
  }

  to {
      margin-left: 0%;
      width: 100%;
  }
}

.move-trans-toRight-footer {
  animation-duration: 1s;
  animation-name: slidein-toRight;
}

@keyframes slidein-toRight-footer {
  from {
      margin-left: -100%;
      width: 85%;
  }

  to {
      margin-left: 0%;
      width: 85%;
  }
}


.spin-image {
  animation: spin 8s infinite linear;
}

/* 定义名为 'spin' 的动画 */
@keyframes spin {
  from { transform: rotate(0deg); margin-top:0%; }
  to { transform: rotate(720deg); margin-top:100%;}
}


.arrow {
  background: linear-gradient(
              -135deg,
              transparent 22px,
              #04e6fb 22px,
              #65ff9a 100%
          )
          top right,
      linear-gradient(
              -45deg,
              transparent 22px,
              #04e6fb 22px,
              #65ff9a 100%
          )
          bottom right;
  background-size: 100% 50%;
  background-repeat: no-repeat;
}


